<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>06_超链接练习</title>
</head>
<body>
    <a href="https://www.baidu.com">点击跳转</a>
    <a href="https://www.tmooc.cn/">达内首页</a>
    <a href="01_HTML结构.html">今天的第一个页面</a>
    <a href="1.jpg">打开图片</a><br>
    <a href="https://www.jd.com"><img src="./img/2.jpg" width="900" alt=""></a>
    <hr>
    <h1 id="title">西游记</h1>
    <a href="#c1">跳转至第一章</a>
    <a href="#c2">跳转至第二章</a>
    <a href="#c3">跳转至第三章</a>
    <a href="#c4">跳转至第四章</a>
    <h2 id="c1">第一章</h2>
    <p>
        <span>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Assumenda at autem dolore dolorum eaque esse facilis in inventore ipsam labore modi molestiae, non omnis quis repellat sit, soluta tempore vero.</span><span>Ad eaque eius in minus nulla possimus provident quam quo ratione ut, vel, voluptatum. Amet consequatur cupiditate, doloremque dolores, eligendi, expedita fuga ipsam nemo officia quaerat quas quibusdam sit vero.</span><span>Ab beatae consequuntur corporis illo ipsam laudantium reprehenderit! Aliquid animi architecto aspernatur, autem dolore, est eum facere facilis illo maxime minima minus officiis, perferendis possimus quaerat quos repellendus. Totam, voluptas.</span><span>Aspernatur dolorum illo iure molestiae nam nesciunt sint veniam. Ab alias aut obcaecati recusandae reprehenderit. Doloremque dolorum ea hic incidunt magni nam obcaecati qui rem reprehenderit soluta, veniam voluptas voluptates.</span><span>Adipisci consectetur culpa dicta dignissimos distinctio eos illo, ipsa laudantium minima nemo non odit officiis perferendis porro quo reiciendis saepe tempore tenetur, vel veniam. Aliquam debitis fugit praesentium quam similique.</span><span>Doloribus ex iure laboriosam sit! Alias corporis dolorem enim nobis non perferendis quos sequi temporibus ullam. Animi, aspernatur facilis illo itaque, laboriosam natus nemo nihil nostrum omnis optio, repellat veniam?</span><span>Accusantium aspernatur at autem excepturi libero molestiae nihil numquam, quae quod recusandae, saepe sit temporibus vitae. Ea eos, excepturi nemo obcaecati quos repellendus velit! Accusantium blanditiis cum exercitationem laudantium voluptates.</span><span>Accusamus adipisci, aliquam, commodi debitis dicta dolores eligendi expedita facere facilis fuga inventore laudantium nemo nesciunt, non odio odit quaerat quam quibusdam quis quod ratione repellat rerum similique tempore veritatis!</span><span>Culpa, dolore doloremque esse illo ipsam iusto magni molestias nobis, non numquam possimus quae quidem ratione repudiandae rerum sed, sunt. Amet assumenda consectetur dolorem doloribus, earum et laboriosam molestiae quaerat!</span><span>Consequuntur inventore ipsa nostrum nulla veniam. Asperiores corporis dolores eos est illo nobis quo sequi soluta sunt tempore. Accusantium incidunt iste non officiis perspiciatis, temporibus voluptas. Ab aperiam harum perferendis?</span>
    </p>
    <h2 id="c2">第二章</h2>
    <p>
        <span>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Assumenda at autem dolore dolorum eaque esse facilis in inventore ipsam labore modi molestiae, non omnis quis repellat sit, soluta tempore vero.</span><span>Ad eaque eius in minus nulla possimus provident quam quo ratione ut, vel, voluptatum. Amet consequatur cupiditate, doloremque dolores, eligendi, expedita fuga ipsam nemo officia quaerat quas quibusdam sit vero.</span><span>Ab beatae consequuntur corporis illo ipsam laudantium reprehenderit! Aliquid animi architecto aspernatur, autem dolore, est eum facere facilis illo maxime minima minus officiis, perferendis possimus quaerat quos repellendus. Totam, voluptas.</span><span>Aspernatur dolorum illo iure molestiae nam nesciunt sint veniam. Ab alias aut obcaecati recusandae reprehenderit. Doloremque dolorum ea hic incidunt magni nam obcaecati qui rem reprehenderit soluta, veniam voluptas voluptates.</span><span>Adipisci consectetur culpa dicta dignissimos distinctio eos illo, ipsa laudantium minima nemo non odit officiis perferendis porro quo reiciendis saepe tempore tenetur, vel veniam. Aliquam debitis fugit praesentium quam similique.</span><span>Doloribus ex iure laboriosam sit! Alias corporis dolorem enim nobis non perferendis quos sequi temporibus ullam. Animi, aspernatur facilis illo itaque, laboriosam natus nemo nihil nostrum omnis optio, repellat veniam?</span><span>Accusantium aspernatur at autem excepturi libero molestiae nihil numquam, quae quod recusandae, saepe sit temporibus vitae. Ea eos, excepturi nemo obcaecati quos repellendus velit! Accusantium blanditiis cum exercitationem laudantium voluptates.</span><span>Accusamus adipisci, aliquam, commodi debitis dicta dolores eligendi expedita facere facilis fuga inventore laudantium nemo nesciunt, non odio odit quaerat quam quibusdam quis quod ratione repellat rerum similique tempore veritatis!</span><span>Culpa, dolore doloremque esse illo ipsam iusto magni molestias nobis, non numquam possimus quae quidem ratione repudiandae rerum sed, sunt. Amet assumenda consectetur dolorem doloribus, earum et laboriosam molestiae quaerat!</span><span>Consequuntur inventore ipsa nostrum nulla veniam. Asperiores corporis dolores eos est illo nobis quo sequi soluta sunt tempore. Accusantium incidunt iste non officiis perspiciatis, temporibus voluptas. Ab aperiam harum perferendis?</span>
    </p>
    <h2 id="c3">第三章</h2>
    <p>
        <span>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Assumenda at autem dolore dolorum eaque esse facilis in inventore ipsam labore modi molestiae, non omnis quis repellat sit, soluta tempore vero.</span><span>Ad eaque eius in minus nulla possimus provident quam quo ratione ut, vel, voluptatum. Amet consequatur cupiditate, doloremque dolores, eligendi, expedita fuga ipsam nemo officia quaerat quas quibusdam sit vero.</span><span>Ab beatae consequuntur corporis illo ipsam laudantium reprehenderit! Aliquid animi architecto aspernatur, autem dolore, est eum facere facilis illo maxime minima minus officiis, perferendis possimus quaerat quos repellendus. Totam, voluptas.</span><span>Aspernatur dolorum illo iure molestiae nam nesciunt sint veniam. Ab alias aut obcaecati recusandae reprehenderit. Doloremque dolorum ea hic incidunt magni nam obcaecati qui rem reprehenderit soluta, veniam voluptas voluptates.</span><span>Adipisci consectetur culpa dicta dignissimos distinctio eos illo, ipsa laudantium minima nemo non odit officiis perferendis porro quo reiciendis saepe tempore tenetur, vel veniam. Aliquam debitis fugit praesentium quam similique.</span><span>Doloribus ex iure laboriosam sit! Alias corporis dolorem enim nobis non perferendis quos sequi temporibus ullam. Animi, aspernatur facilis illo itaque, laboriosam natus nemo nihil nostrum omnis optio, repellat veniam?</span><span>Accusantium aspernatur at autem excepturi libero molestiae nihil numquam, quae quod recusandae, saepe sit temporibus vitae. Ea eos, excepturi nemo obcaecati quos repellendus velit! Accusantium blanditiis cum exercitationem laudantium voluptates.</span><span>Accusamus adipisci, aliquam, commodi debitis dicta dolores eligendi expedita facere facilis fuga inventore laudantium nemo nesciunt, non odio odit quaerat quam quibusdam quis quod ratione repellat rerum similique tempore veritatis!</span><span>Culpa, dolore doloremque esse illo ipsam iusto magni molestias nobis, non numquam possimus quae quidem ratione repudiandae rerum sed, sunt. Amet assumenda consectetur dolorem doloribus, earum et laboriosam molestiae quaerat!</span><span>Consequuntur inventore ipsa nostrum nulla veniam. Asperiores corporis dolores eos est illo nobis quo sequi soluta sunt tempore. Accusantium incidunt iste non officiis perspiciatis, temporibus voluptas. Ab aperiam harum perferendis?</span>
    </p>
    <h2 id="c4">第四章</h2>
    <p>
        <span>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Assumenda at autem dolore dolorum eaque esse facilis in inventore ipsam labore modi molestiae, non omnis quis repellat sit, soluta tempore vero.</span><span>Ad eaque eius in minus nulla possimus provident quam quo ratione ut, vel, voluptatum. Amet consequatur cupiditate, doloremque dolores, eligendi, expedita fuga ipsam nemo officia quaerat quas quibusdam sit vero.</span><span>Ab beatae consequuntur corporis illo ipsam laudantium reprehenderit! Aliquid animi architecto aspernatur, autem dolore, est eum facere facilis illo maxime minima minus officiis, perferendis possimus quaerat quos repellendus. Totam, voluptas.</span><span>Aspernatur dolorum illo iure molestiae nam nesciunt sint veniam. Ab alias aut obcaecati recusandae reprehenderit. Doloremque dolorum ea hic incidunt magni nam obcaecati qui rem reprehenderit soluta, veniam voluptas voluptates.</span><span>Adipisci consectetur culpa dicta dignissimos distinctio eos illo, ipsa laudantium minima nemo non odit officiis perferendis porro quo reiciendis saepe tempore tenetur, vel veniam. Aliquam debitis fugit praesentium quam similique.</span><span>Doloribus ex iure laboriosam sit! Alias corporis dolorem enim nobis non perferendis quos sequi temporibus ullam. Animi, aspernatur facilis illo itaque, laboriosam natus nemo nihil nostrum omnis optio, repellat veniam?</span><span>Accusantium aspernatur at autem excepturi libero molestiae nihil numquam, quae quod recusandae, saepe sit temporibus vitae. Ea eos, excepturi nemo obcaecati quos repellendus velit! Accusantium blanditiis cum exercitationem laudantium voluptates.</span><span>Accusamus adipisci, aliquam, commodi debitis dicta dolores eligendi expedita facere facilis fuga inventore laudantium nemo nesciunt, non odio odit quaerat quam quibusdam quis quod ratione repellat rerum similique tempore veritatis!</span><span>Culpa, dolore doloremque esse illo ipsam iusto magni molestias nobis, non numquam possimus quae quidem ratione repudiandae rerum sed, sunt. Amet assumenda consectetur dolorem doloribus, earum et laboriosam molestiae quaerat!</span><span>Consequuntur inventore ipsa nostrum nulla veniam. Asperiores corporis dolores eos est illo nobis quo sequi soluta sunt tempore. Accusantium incidunt iste non officiis perspiciatis, temporibus voluptas. Ab aperiam harum perferendis?</span>
    </p>
    <a href="#title">回到顶部</a>
</body>
</html>